// props 传值
import React from 'react';
import Child1 from './child';
class Props extends React.Component {

    state = {
      num: 100,
      list: [1, 2, 3, 4, 5],
      currentMsg: ''
    }
    // 接收子组件传递过来的方法
    getChildMsg = (msg) => {
      console.log('这是一个方法', msg);
      this.setState({
        currentMsg: msg
      });
    }

    render() {
      return (
        <div>
          {/* 子组件 */}
          <Child1
          num={this.state.num}
          age={18}
          colors={['react', 'vue']}
          getMsg={this.getChildMsg}
          tag={<h1>这是一个标签</h1>}
          />
          <h2 style={{color: 'red'}}>{this.state.currentMsg}</h2>
          <br />
          <Child2 list={this.state.list} getMsg={this.getChildMsg} />
        </div>
      );
    }
  }

  // 子组件1
  const Child2 = (props) => {
    const getClick = () => {
      props.getMsg('我是兄弟组件1传递过来的参数')
    }
    return (
      <div>
        {props.list.map((item, index) => {
          return <h1 key={index}>{item}</h1>
        })}
        <button onClick={getClick}>点击我传递参数给父组件</button>
      </div>
    );
  }
export default Props;